<template>
  <div class="app-container">

    <el-row :gutter="20">
      <!--申请人数据-->
      <el-col :span="24"
              :xs="24">
        <el-table :data="applicantList"
                  @selection-change="handleSelectionChange">
          <el-table-column type="selection"
                           width="50"
                           align="center" />
          <el-table-column label="申请人"
                           align="center"
                           prop="applicantName"
                           v-if="columns[0].visible">
          </el-table-column>
          <el-table-column label="证件号码"
                           align="center"
                           prop="applicantNo"
                           v-if="columns[1].visible"
                           :show-overflow-tooltip="true" />
        </el-table>
        <pagination v-show="total > 0"
                    :total="total"
                    :page.sync="queryParams.pageNum"
                    :limit.sync="queryParams.pageSize"
                    @pagination="getApplicantList" />
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { findApplicant } from '@/api/patent/Bao'

export default {
  dicts: [
    //专利类型字典
    'ipms_information_type',
  ],
  //数据
  data() {
    return {
      //发明人列表
      applicantList: [],
      // 选中数组
      Nos: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 总条数
      total: 0,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        contractNo: undefined,
      },
      // 列信息
      columns: [
        { key: 0, visible: true },
        { key: 1, visible: true },
        { key: 2, visible: true },
        { key: 3, visible: true },
        { key: 4, visible: true },
      ],
    }
  },

  //钩子
  created() {
    this.getApplicantList()
  },

  //方法
  methods: {
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.Nos = selection.map((item) => item.applicantId)
      this.single = selection.length != 1
      this.multiple = !selection.length
    },
    //获取全部申请人分页
    getApplicantList() {
      this.loading = true
      findApplicant(this.queryParams, 0).then((resp) => {
        this.loading = false
        this.applicantList = resp.rows
        this.total = resp.total
      })
    },
  },
}
</script>

<style lang="stylus" scoped></style>